<template>
	<view class="page-fade-in" :style="{opacity: pageOpc}">
		<template v-if="pageOpc">
			<view class="content flexWarpCenterColumn">
				<view class="link-img flexWarpCenterColumn">
					<image src="../static/home/ball.png" class="ball"></image>
					<image src="../static/home/wifi-icon.png" class="wifi-icon"></image>
				</view>
				<view class="wifi-info flexWarpCenterColumn">
					<view class="wifi-item wifi-name">
						{{ssid}}
					</view>
					<view class="wifi-item">
						<text>密码:</text> {{password}}
					</view>
					<view class="tips">请检测是否打开wifi连接</view>
				</view>
				<view class="click-btn" @tap="connectWifi()">一键连接</view>
			</view>
		</template>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pageOpc:0,
				ssid:"Moyu-24h-5G",
				password:"Moyu8888",
				store_id:""
			}
		},
		onLoad(ops) {
			this.store_id=ops.store_id||uni.getStorageSync('store_id')
			if(this.store_id){
				uni.setStorageSync('store_id',this.store_id)
			}
			this.storeDetails();
			this.startWifi();
		},
		onReady(){
			setTimeout(() => {
				this.pageOpc=1
			}, 100)
		},
		methods: {
			storeDetails(){
				this.$request.post(this.$api.storeDetails, {
					store_id:uni.getStorageSync('store_id'),
					longitude:uni.getStorageSync('longitude')||"106.540541",
					latitude:uni.getStorageSync('latitude')||"29.590991"
				}, {}).then(res => {
					let {
						data = {}
					} = res;
					if (res.code==1) {
						this.ssid=data.wifi_title//位置导航
						this.password=data.wifi_pas//位置导航
					}
				})
			},
			startWifi(){
				wx.startWifi({
				  success (res) {
				    console.log(res.errMsg)
				  },
				  complete(com){
					  console.log(com)
				  }
				})
			},
			connectWifi(){
				let that=this
				wx.connectWifi({
				  SSID:that.ssid,
				  password:that.password,
				  success (res) {
				    console.log(res.errMsg)
					that.$tools.showToast('链接成功')
				  },
				  fail(err) {
				  	if(err.errCode=='12001'){
						that.$tools.showToast('当前系统不支持相关能力')
					}else if(err.errCode=='12002'){
						that.$tools.showToast('密码错误')
					}else if(err.errCode=='12003'){
						that.$tools.showToast('连接超时,请稍后再试一下吧')
					}else if(err.errCode=='12004'){
						that.$tools.showToast('重复连接 Wi-Fi')
					}else if(err.errCode=='12005'){
						that.$tools.showToast('未打开 Wi-Fi 开关')
					}else if(err.errCode=='12006'){
						that.$tools.showToast('未打开 GPS 定位开关')
					}else if(err.errCode=='12013'){
						that.$tools.showToast('系统保存的 Wi-Fi 配置过期，建议忘记 Wi-Fi 后重试')
					}
					setTimeout(()=>{
						uni.showModal({
							title:'当前wifi无法自动连接',
							content:'是否手动连接?',
							success: (res) => {
								if(res.confirm==1){
									wx.connectWifi({
									  SSID:that.ssid,
									  password:that.password,
									  maunal:true,
									  success (res) {
									    console.log(res.errMsg)
									  }
									})
								}
							}
						})
					},1000)
				  },
				  complete(com){
					  console.log(com)
				  }
				})
			}
		}
	}
</script>

<style lang="scss">
	.content{
		padding: 18upx 36upx;
	}
	.link-img{
		position: relative;
		padding-top: 140upx;
		.ball{
			width: 612upx;
			height: 612upx;
		}
		.wifi-icon{
			width: 140upx;
			height: 140upx;
			position: absolute;
			left: 0;
			right: 0;
			bottom: -48upx;
			margin: auto;
		}
	}
	.wifi-info{
		padding: 40upx 0;
		margin-top: 28upx;
		width:100%;
		.wifi-item{
			font-size: 34rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 72upx;
			padding: 0 40upx;
		}
		.wifi-name{
			font-family: PingFang SC, PingFang SC;
			font-weight: 600;
			font-size: 54rpx;
		}
		.tips{
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 30rpx;
			color:#848688;
		}
	}
	.click-btn{
		width: 649rpx;
		height: 144rpx;
		line-height: 144rpx;
		background: linear-gradient( 90deg, #4AA22A 0%, #69D037 100%);
		border-radius: 72rpx 72rpx 72rpx 72rpx;
		text-align: center;
		font-size: 36rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
		margin-top: 32upx;
	}
</style>
